<!DOCTYPE html><html><head><title>Ext.Object | Ext JS 4.0 Documentation</title><script type="text/javascript" src="../ext-all.js"></script><link rel="stylesheet" href="../reset.css" type="text/css"><link rel="stylesheet" href="../scrollbars.css" type="text/css"><link rel="stylesheet" href="../docs.css" type="text/css"><link id="styleCss" rel="stylesheet" href="../style.css" type="text/css"><script type="text/javascript" src="../prettify.js"></script><link rel="stylesheet" href="../prettify.css" type="text/css"><!-- link(rel: 'stylesheet', href: req.baseURL + '/css/ext4.css', type: 'text/css')--><link rel="shortcut icon" type="image/ico" href="../favicon.ico"><!--[if IE]>
<style type="text/css">.head-band { display: none; }
.header { border: 0; top: 0; left: 0px; background: url(../header.gif) repeat-x; }
.doc-tab .members .member a.more { background-color: #efefef; }
</style><link rel="stylesheet" href="/new/css/ie.css" type="text/css"><![endif]-->
</head><body id="ext-body" class="iScroll"><div id="notice" class="notice">For up to date documentation and features, visit 
<a href="http://docs.sencha.com/ext-js/4-0">http://docs.sencha.com/ext-js/4-0</a></div><div class="wrapper"><div class="head-band"></div><div class="header"><h2><a href="../index.html">Sencha Documentation</a></h2></div><div id="search"><form><input type="text" placeholder="Search" id="search-field" autocomplete="off" name="q"></form><div id="search-box"></div></div><div id="treePanel"></div><div id="container"><script type="text/javascript">

    req = {
        liveURL: '.',
        standAloneMode: true,
        origDocClass: 'Ext.Object',
        docClass: 'Ext.Object',
        docReq: 'Ext.Object',
        version: '4.0',
        baseURL: '.',
        baseDocURL: '.',
        baseProdURL: '.'
    };

    clsInfo = {};



</script>

<script type="text/javascript" src="../search.js"></script>
<!--script type="text/javascript" src="/new/javascripts/app/examples.js"></script-->
<script type="text/javascript" src="../class_tree.js"></script>
<script type="text/javascript" src="../class_doc.js"></script>
<script type="text/javascript">
    req.source = 'Object.html#Ext-Object';
    clsInfo = {"methods":["each","fromQueryString","getKey","getSize","getValues","merge","toQueryObjects","toQueryString"],"cfgs":[],"properties":["getKeys"],"events":[],"subclasses":[]};
    Ext.onReady(function() {
        Ext.create('Docs.classPanel');
    });
</script><div id="top-block" class="top-block"><h1 id="clsTitle" class="cls"><a href="../source/Object.html#Ext-Object" target="_blank">Ext.Object</a></h1></div><div id="docContent"><div id="doc-overview-content"><div class="lft"><p>A collection of useful static methods to deal with objects</p>
<div class="members"><div class="m-properties"><a name="properties"></a><div class="definedBy">Defined By</div><h3 class="prp p">Properties</h3><div id="property-getKeys" class="member f ni"><a href="Ext.Object.html#property-getKeys" rel="property-getKeys" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.Object.html" class="definedIn docClass">Ext.Object</a><br/><a href="../source/Object.html#Ext-Object-property-getKeys" class="viewSource">view source</a></div><a name="getKeys"></a><a name="property-getKeys"></a><a href="Ext.Object.html#" rel="property-getKeys" class="cls expand">getKeys</a><span> : Object</span></div><div class="description"><div class="short">Gets all keys of the given object as an array.

var values = Ext.Object.getKeys({
    name: 'Jacky',
    loves: 'food...</div><div class="long"><p>Gets all keys of the given object as an array.</p>

<pre><code>var values = Ext.Object.getKeys({
    name: 'Jacky',
    loves: 'food'
}); // ['name', 'loves']
</code></pre>
</div></div></div></div><div class="m-methods"><a name="methods"></a><div class="definedBy">Defined By</div><h3 class="mth p">Methods</h3><div id="method-each" class="member f ni"><a href="Ext.Object.html#method-each" rel="method-each" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.Object.html" class="definedIn docClass">Ext.Object</a><br/><a href="../source/Object.html#Ext-Object-method-each" class="viewSource">view source</a></div><a name="each"></a><a name="method-each"></a><a href="Ext.Object.html#" rel="method-each" class="cls expand">each</a>(
<span class="pre">Object object, Function fn, Object scope</span>)
 : void</div><div class="description"><div class="short">Iterate through an object and invoke the given callback function for each iteration. The iteration can be stop
by ret...</div><div class="long"><p>Iterate through an object and invoke the given callback function for each iteration. The iteration can be stop
by returning <code>false</code> in the callback function. For example:</p>

<pre><code>var person = {
    name: 'Jacky'
    hairColor: 'black'
    loves: ['food', 'sleeping', 'wife']
};

Ext.Object.each(person, function(key, value, myself) {
    console.log(key + ":" + value);

    if (key === 'hairColor') {
        return false; // stop the iteration
    }
});
</code></pre>
<h3 class="pa">Parameters</h3><ul><li><span class="pre">object</span> : Object<div class="sub-desc"><p>The object to iterate</p>
</div></li><li><span class="pre">fn</span> : Function<div class="sub-desc"><p>The callback function. Passed arguments for each iteration are:</p>

<ul>
<li>{String} <code>key</code></li>
<li>{Mixed} <code>value</code></li>
<li>{Object} <code>object</code> The object itself</li>
</ul>

</div></li><li><span class="pre">scope</span> : Object<div class="sub-desc"><p>(Optional) The execution scope (<code>this</code>) of the callback function</p>
</div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
</li></ul></div></div></div><div id="method-fromQueryString" class="member ni"><a href="Ext.Object.html#method-fromQueryString" rel="method-fromQueryString" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.Object.html" class="definedIn docClass">Ext.Object</a><br/><a href="../source/Object.html#Ext-Object-method-fromQueryString" class="viewSource">view source</a></div><a name="fromQueryString"></a><a name="method-fromQueryString"></a><a href="Ext.Object.html#" rel="method-fromQueryString" class="cls expand">fromQueryString</a>(
<span class="pre">String queryString, Boolean recursive</span>)
 : Object</div><div class="description"><div class="short">Converts a query string back into an object.


Non-recursive:

  Ext.Object.fromQueryString(foo=1&amp;bar=2); // retu...</div><div class="long"><p>Converts a query string back into an object.</p>

<ul>
<li><p>Non-recursive:</p>

<p>  Ext.Object.fromQueryString(foo=1&amp;bar=2); // returns {foo: 1, bar: 2}
  Ext.Object.fromQueryString(foo=&amp;bar=2); // returns {foo: null, bar: 2}
  Ext.Object.fromQueryString(some%20price=%24300); // returns {'some price': '$300'}
  Ext.Object.fromQueryString(colors=red&amp;colors=green&amp;colors=blue); // returns {colors: ['red', 'green', 'blue']}</p></li>
<li><p>Recursive:</p>

<p>  Ext.Object.fromQueryString("username=Jacky&amp;dateOfBirth[day]=1&amp;dateOfBirth[month]=2&amp;dateOfBirth[year]=1911&amp;hobbies[0]=coding&amp;hobbies[1]=eating&amp;hobbies[2]=sleeping&amp;hobbies[3][0]=nested&amp;hobbies[3][1]=stuff", true);</p>

<p>  // returns
  {</p>

<pre><code>  username: 'Jacky',
  dateOfBirth: {
      day: '1',
      month: '2',
      year: '1911'
  },
  hobbies: ['coding', 'eating', 'sleeping', ['nested', 'stuff']]
</code></pre>

<p>  }</p></li>
</ul>

<h3 class="pa">Parameters</h3><ul><li><span class="pre">queryString</span> : String<div class="sub-desc"><p>The query string to decode</p>
</div></li><li><span class="pre">recursive</span> : Boolean<div class="sub-desc"><p>(Optional) Whether or not to recursively decode the string. This format is supported by
PHP / Ruby on Rails servers and similar. Defaults to false</p>
</div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">Object</span>&nbsp; &nbsp;
</li></ul></div></div></div><div id="method-getKey" class="member ni"><a href="Ext.Object.html#method-getKey" rel="method-getKey" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.Object.html" class="definedIn docClass">Ext.Object</a><br/><a href="../source/Object.html#Ext-Object-method-getKey" class="viewSource">view source</a></div><a name="getKey"></a><a name="method-getKey"></a><a href="Ext.Object.html#" rel="method-getKey" class="cls expand">getKey</a>(
<span class="pre">Object object, Object value</span>)
 : void</div><div class="description"><div class="short">Returns the first matching key corresponding to the given value.
If no matching value is found, null is returned.

va...</div><div class="long"><p>Returns the first matching key corresponding to the given value.
If no matching value is found, null is returned.</p>

<pre><code>var person = {
    name: 'Jacky',
    loves: 'food'
};

alert(Ext.Object.getKey(sencha, 'loves')); // alerts 'food'
</code></pre>
<h3 class="pa">Parameters</h3><ul><li><span class="pre">object</span> : Object<div class="sub-desc">
</div></li><li><span class="pre">value</span> : Object<div class="sub-desc"><p>The value to find</p>
</div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
</li></ul></div></div></div><div id="method-getSize" class="member ni"><a href="Ext.Object.html#method-getSize" rel="method-getSize" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.Object.html" class="definedIn docClass">Ext.Object</a><br/><a href="../source/Object.html#Ext-Object-method-getSize" class="viewSource">view source</a></div><a name="getSize"></a><a name="method-getSize"></a><a href="Ext.Object.html#" rel="method-getSize" class="cls expand">getSize</a>(
<span class="pre">Object object</span>)
 : Number</div><div class="description"><div class="short">Gets the total number of this object's own properties

var size = Ext.Object.getSize({
    name: 'Jacky',
    loves: ...</div><div class="long"><p>Gets the total number of this object's own properties</p>

<pre><code>var size = Ext.Object.getSize({
    name: 'Jacky',
    loves: 'food'
}); // size equals 2
</code></pre>
<h3 class="pa">Parameters</h3><ul><li><span class="pre">object</span> : Object<div class="sub-desc">
</div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">Number</span>&nbsp; &nbsp;<p>size</p>
</li></ul></div></div></div><div id="method-getValues" class="member ni"><a href="Ext.Object.html#method-getValues" rel="method-getValues" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.Object.html" class="definedIn docClass">Ext.Object</a><br/><a href="../source/Object.html#Ext-Object-method-getValues" class="viewSource">view source</a></div><a name="getValues"></a><a name="method-getValues"></a><a href="Ext.Object.html#" rel="method-getValues" class="cls expand">getValues</a>(
<span class="pre">Object object</span>)
 : Array</div><div class="description"><div class="short">Gets all values of the given object as an array.

var values = Ext.Object.getValues({
    name: 'Jacky',
    loves: '...</div><div class="long"><p>Gets all values of the given object as an array.</p>

<pre><code>var values = Ext.Object.getValues({
    name: 'Jacky',
    loves: 'food'
}); // ['Jacky', 'food']
</code></pre>
<h3 class="pa">Parameters</h3><ul><li><span class="pre">object</span> : Object<div class="sub-desc">
</div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">Array</span>&nbsp; &nbsp;<p>An array of values from the object</p>
</li></ul></div></div></div><div id="method-merge" class="member ni"><a href="Ext.Object.html#method-merge" rel="method-merge" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.Object.html" class="definedIn docClass">Ext.Object</a><br/><a href="../source/Object.html#Ext-Object-method-merge" class="viewSource">view source</a></div><a name="merge"></a><a name="method-merge"></a><a href="Ext.Object.html#" rel="method-merge" class="cls expand">merge</a>(
<span class="pre">Object object, Object key, Object value</span>)
 : Object</div><div class="description"><div class="short">Merges any number of objects recursively without referencing them or their children.

var extjs = {
    companyName: ...</div><div class="long"><p>Merges any number of objects recursively without referencing them or their children.</p>

<pre><code>var extjs = {
    companyName: 'Ext JS',
    products: ['Ext JS', 'Ext GWT', 'Ext Designer'],
    isSuperCool: true
    office: {
        size: 2000,
        location: 'Palo Alto',
        isFun: true
    }
};

var newStuff = {
    companyName: 'Sencha Inc.',
    products: ['Ext JS', 'Ext GWT', 'Ext Designer', 'Sencha Touch', 'Sencha Animator'],
    office: {
        size: 40000,
        location: 'Redwood City'
    }
};

var sencha = Ext.Object.merge(extjs, newStuff);

// extjs and sencha then equals to
{
    companyName: 'Sencha Inc.',
    products: ['Ext JS', 'Ext GWT', 'Ext Designer', 'Sencha Touch', 'Sencha Animator'],
    isSuperCool: true
    office: {
        size: 30000,
        location: 'Redwood City'
        isFun: true
    }
}
</code></pre>
<h3 class="pa">Parameters</h3><ul><li><span class="pre">object</span> : Object<div class="sub-desc"><p>,...</p>
</div></li><li><span class="pre">key</span> : Object<div class="sub-desc">
</div></li><li><span class="pre">value</span> : Object<div class="sub-desc">
</div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">Object</span>&nbsp; &nbsp;<p>merged The object that is created as a result of merging all the objects passed in.</p>
</li></ul></div></div></div><div id="method-toQueryObjects" class="member ni"><a href="Ext.Object.html#method-toQueryObjects" rel="method-toQueryObjects" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.Object.html" class="definedIn docClass">Ext.Object</a><br/><a href="../source/Object.html#Ext-Object-method-toQueryObjects" class="viewSource">view source</a></div><a name="toQueryObjects"></a><a name="method-toQueryObjects"></a><a href="Ext.Object.html#" rel="method-toQueryObjects" class="cls expand">toQueryObjects</a>(
<span class="pre">String name, Mixed value, Boolean recursive</span>)
 : void</div><div class="description"><div class="short">Convert a name - value pair to an array of objects with support for nested structures; useful to construct
query stri...</div><div class="long"><p>Convert a <code>name</code> - <code>value</code> pair to an array of objects with support for nested structures; useful to construct
query strings. For example:</p>

<pre><code>var objects = Ext.Object.toQueryObjects('hobbies', ['reading', 'cooking', 'swimming']);

// objects then equals:
[
    { name: 'hobbies', value: 'reading' },
    { name: 'hobbies', value: 'cooking' },
    { name: 'hobbies', value: 'swimming' },
];

var objects = Ext.Object.toQueryObjects('dateOfBirth', {
    day: 3,
    month: 8,
    year: 1987,
    extra: {
        hour: 4
        minute: 30
    }
}, true); // Recursive

// objects then equals:
[
    { name: 'dateOfBirth[day]', value: 3 },
    { name: 'dateOfBirth[month]', value: 8 },
    { name: 'dateOfBirth[year]', value: 1987 },
    { name: 'dateOfBirth[extra][hour]', value: 4 },
    { name: 'dateOfBirth[extra][minute]', value: 30 },
];
</code></pre>
<h3 class="pa">Parameters</h3><ul><li><span class="pre">name</span> : String<div class="sub-desc">
</div></li><li><span class="pre">value</span> : Mixed<div class="sub-desc">
</div></li><li><span class="pre">recursive</span> : Boolean<div class="sub-desc">
</div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
</li></ul></div></div></div><div id="method-toQueryString" class="member ni"><a href="Ext.Object.html#method-toQueryString" rel="method-toQueryString" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.Object.html" class="definedIn docClass">Ext.Object</a><br/><a href="../source/Object.html#Ext-Object-method-toQueryString" class="viewSource">view source</a></div><a name="toQueryString"></a><a name="method-toQueryString"></a><a href="Ext.Object.html#" rel="method-toQueryString" class="cls expand">toQueryString</a>(
<span class="pre">Object object, [Boolean recursive]</span>)
 : String</div><div class="description"><div class="short">Takes an object and converts it to an encoded query string


Non-recursive:

  Ext.Object.toQueryString({foo: 1, bar:...</div><div class="long"><p>Takes an object and converts it to an encoded query string</p>

<ul>
<li><p>Non-recursive:</p>

<p>  Ext.Object.toQueryString({foo: 1, bar: 2}); // returns "foo=1&amp;bar=2"
  Ext.Object.toQueryString({foo: null, bar: 2}); // returns "foo=&amp;bar=2"
  Ext.Object.toQueryString({'some price': '$300'}); // returns "some%20price=%24300"
  Ext.Object.toQueryString({date: new Date(2011, 0, 1)}); // returns "date=%222011-01-01T00%3A00%3A00%22"
  Ext.Object.toQueryString({colors: ['red', 'green', 'blue']}); // returns "colors=red&amp;colors=green&amp;colors=blue"</p></li>
<li><p>Recursive:</p>

<p>  Ext.Object.toQueryString({</p>

<pre><code>  username: 'Jacky',
  dateOfBirth: {
      day: 1,
      month: 2,
      year: 1911
  },
  hobbies: ['coding', 'eating', 'sleeping', ['nested', 'stuff']]
</code></pre>

  }, true); // returns the following string (broken down and url-decoded for ease of reading purpose):

<pre><code>        // username=Jacky
        //    &amp;dateOfBirth[day]=1&amp;dateOfBirth[month]=2&amp;dateOfBirth[year]=1911
        //    &amp;hobbies[0]=coding&amp;hobbies[1]=eating&amp;hobbies[2]=sleeping&amp;hobbies[3][0]=nested&amp;hobbies[3][1]=stuff
</code></pre></li>
</ul>

<h3 class="pa">Parameters</h3><ul><li><span class="pre">object</span> : Object<div class="sub-desc"><p>The object to encode</p>
</div></li><li><span class="pre">recursive</span> : Boolean<div class="sub-desc"><p>(optional) Whether or not to interpret the object in recursive format.
(PHP / Ruby on Rails servers and similar). Defaults to false</p>
</div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">String</span>&nbsp; &nbsp;<p>queryString</p>
</li></ul></div></div></div></div></div></div></div><div id="pageContent"></div></div></div></div></body></html>